import React from 'react';
import style from '../index.less';
import { Radio, Popover, Spin, message } from 'antd';
import { PrimaryC, PrimaryGhostC } from '../../../../comps';
import { connect } from 'dva';
import stringify from 'qs/lib/stringify';
import { exportFile } from '@/src/utils/commonFunc';
class ExportDataC extends React.Component {
  state = {
    visible: false, //是否弹出选择框
    exportType: undefined, //选中类型
    selectList: [], //下载类型
  };
  componentDidMount() {
    this.getExportTypeList();
  }
  //获取下载类型
  getExportTypeList = () => {
    this.props.dispatch({
      type: 'survivalManageM/getExportTypeList',
      payload: {},
      callback: (data) => {
        this.setState({
          selectList: data || [],
        });
      },
    });
  };
  // 弹窗显示状态
  handleVisibleChange = (visible) => {
    this.setState({
      visible: visible,
    });
  };
  //选中类型切换
  handleClick = (e, id) => {
    const { selectList } = this.state;
    selectList.map((item) => {
      if (item.value == id) {
        item.selected = !item.selected;
        this.setState({
          exportType: item.selected ? id : undefined,
        });
      } else {
        item.selected = false;
      }
    });
  };
  //取消
  cancel = () => {
    const { selectList } = this.state;
    selectList.map((item) => {
      item.selected = false;
    });
    this.setState({
      visible: false,
      exportType: undefined,
      selectList: [...selectList], //全部类型为初始化未选中状态
    });
  };

  //导出
  handleOk = () => {
    const { exportType } = this.state;
    if (!exportType) {
      message.warning('请选择下载类型！');
      return;
    }
    if (!this.props.rid) return; //未选中 不可导出
    if (!localStorage.getItem('antd-pro-token')) {
      message.error('下载失败');
      return;
    }
    let values = {
      rid: this.props.rid,
      tableName: exportType,
    };
    exportFile('api/v1/assetSplit/exportAssetSplitGen/exportGenList', values);
    this.cancel(); //取消弹窗
  };
  render() {
    const { selectList } = this.state;
    const { loading } = this.props;
    const content = (
      <Spin spinning={loading.effects['survivalManageM/getExportTypeList'] === true}>
        <div>
          <div className='selectDiv'>
            {selectList &&
              selectList.map((item, index) => {
                return (
                  <div value={item.value} title={item.title} className={item.selected ? 'isSelect' : ''} key={index} onClick={(e) => this.handleClick(e, item.value)}>
                    {item.title}
                  </div>
                );
              })}
          </div>
          <div className='btnArea'>
            <div className='btnCol'>
              <PrimaryGhostC onClick={this.cancel} title={'取消'} style={{ marginRight: '10px' }} />
              <PrimaryC onClick={this.handleOk} title={'导出'} />
            </div>
          </div>
        </div>
      </Spin>
    );

    return (
      <div style={{ position: 'absolute', right: 0, top: '-12px' }}>
        <Popover placement='bottomLeft' content={content} trigger='click' visible={this.state.visible} overlayClassName={style.shstyle} onVisibleChange={this.handleVisibleChange}>
          <PrimaryGhostC title='导出' disabled={!this.props.rid} />
        </Popover>
      </div>
    );
  }
}

export default connect(({ survivalManageM, loading }) => ({
  survivalManageM,
  loading,
}))(ExportDataC);
